<template>
    <div class="box4">
        <template>
            <el-table ref="multipleTable" :data="arr" tooltip-effect="dark" style="width: 100%"
                @selection-change="handleSelectionChange">
                <el-table-column type="selection" width="55">
                </el-table-column>
                <el-table-column label="患者姓名" width="120">
                    <template slot-scope="scope">{{ scope.row.name }}</template>
                </el-table-column>
                <el-table-column prop="card" label="就诊卡号" width="120">
                </el-table-column>
                <el-table-column prop="identity" label="身份证">
                </el-table-column>
                <el-table-column prop="phone" label="手机号码">

                </el-table-column>
                <el-table-column prop="type" label="挂号科室">
                    <template slot-scope="scope">
                        {{ typeObj[scope.row.type] }}
                    </template>
                </el-table-column>
                <el-table-column prop="idd" label="挂号类型">
                    <template slot-scope="scope">
                        <div :class="backColor">
                            {{ typeObj1[scope.row.idd] }}
                        </div>
                    </template>
                </el-table-column>
                <el-table-column prop="cost" label="挂号费">
                </el-table-column>
                <el-table-column prop="state" label="挂号状态">
                    <template slot-scope="scope">
                        {{ typeObj2[scope.row.office] }}
                    </template>
                </el-table-column>
                <el-table-column prop="time" label="就诊日期">
                </el-table-column>
                <el-table-column prop="time1" label="候诊时间">
                </el-table-column>
                <el-table-column prop="time2" label ="预约时间">
                </el-table-column>
                <el-table-column>
                    <template slot-scope="scope">
                        <el-link type="danger" @click="remove(scope.row.id)">删除</el-link>
                        <el-link type="primary" @click="bianji(scope.row)">编辑</el-link>

                    </template>


                </el-table-column>








            </el-table>

        </template>

    </div>



</template>

<script>
import { deleteHomeApi } from '../../../api/interface'
export default {
    props: ['arr',],
    data() {
        return {
            backColor: 'yishi',
            typeObj: {
                0: '肛肠科',
                1: '儿科',
                2: '妇产科',
                3: '耳鼻喉科',
                4: '眼科'

            },
            typeObj1: {
                0: '普通号',
                1: '专家号',
                2: '医师号'

            },
            typeObj2: {
                0: '未就诊',
                1: '已就诊',
                2: '已取消'

            },

            multipleSelection: []
        }
    },

    methods: {



        toggleSelection(rows) {
            if (rows) {
                rows.forEach(row => {
                    this.$refs.multipleTable.toggleRowSelection(row);
                });
            } else {
                this.$refs.multipleTable.clearSelection();
            }
        },
        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        handleClick() {
            alert('button click');
        },

        //删除
        remove(id) {
            console.log(id);
            deleteHomeApi({ id: id }).then(res => {
                console.log('res', res);
                if (res.code == 200) {
                    this.$emit('resetHome')
                }

            })

        },
        bianji(row){
            this.$emit('Bianji',row)

        }





    },

}
</script>

<style>
.box4 {
    margin-top: 30px;
    position: relative;
    min-height: 600px;
}

.cell {
    width: 100%;
}



/* 删除 */
.sc {
    width: 50px;
    height: 50px;
    background: darkgoldenrod;
    position: absolute;
    left: 35px;
    top: 8px;
}




.el-dropdown-link {
    cursor: pointer;
    color: #409EFF;
}

.el-icon-arrow-down {
    font-size: 12px;
}
</style>


<style lang="less" scoped>
/* 选择框 */
.el-checkbox__inner {
    border-radius: 50%;

}

.zhuanjia {
    background: red;

}

.yishi {
    background: darkcyan;
    text-align: center;
    border-radius: 20px;
    color: #fff;
}

.putong {
    background: #fff;
}
</style>




